﻿<!DOCTYPE html>
<html ng-app="demoApp" lang="en">
<head>
    <meta name="keywords" content="AngularJS Calendar, Month Calendar, MonthCalendar, DateTimeInput, DateTimePicker, Date Picker" />
   <meta name="description" content="AngularJS Calendar example. This example demonstrates a Calendar built with Angular JS. Week Numbers feature is demonstrated" /> 
      <title id='Description'>The AngularJS Calendar can show the week of the year. To display the week of the year, you need set the showWeekNumbers property to true. By default, the jqxCalendar does not display the week of the year.
    </title>
    <link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../../scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="../../../scripts/angular.min.js"></script>
    <script type="text/javascript" src="../../../scripts/demos.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../../jqwidgets/jqxangular.js"></script>
    <script type="text/javascript">
        var demoApp = angular.module("demoApp", ["jqwidgets", "jqwidgets-amd"]);
        demoApp.controller("demoController", function ($scope) {
            $scope.calendarSettings = { rowHeaderWidth: 25, showWeekNumbers: true, width: 220, height: 220 };
        });
    </script>
</head>
<body ng-controller="demoController">
    <jqx-calendar jqx-settings="calendarSettings"></jqx-calendar>
</body>
</html>
